
//array holding the questions
var question = new Array();

//gets the qor questions from the database with webmethod "getQorQuestions". And puts them in an array.
function getQuestions() {
    $.ajax({
        type: "POST",
        url: "QoR.aspx/getQorQuestions",
        data: "",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (msg) {
            for (var i = 0; i < msg.d.length; i++) {
                question[i] = msg.d[i];
            }
        },
        complete: function() {
            document.getElementById("questionP").innerHTML = question[currentQ];
        },
        error: function (x, e) {
            alert("Anslutning till frågeservern misslyckades, vänligen försök igen senare");
        }
    });
}


//sets a variable currentQ to the same value as local storage variable currentQuestion.
var currentQ = localStorage.getItem('currentQuestion');
//if the local storage variable has no value, it is set to 0 and currentQ aswell.
if (currentQ == null) {
    localStorage.setItem('currentQuestion', 0);
    currentQ = localStorage.getItem('currentQuestion');
}


//the current answer variable.
var answer = "";

//Array for the answers.
var answerArray = new Array();

//check if the array in local storage is empty, and sets it to answerArray.
if (localStorage['answerArray'] == null) {
    localStorage['answerArray'] = JSON.stringify(answerArray);
    //if its not empty, answerArray is set to the local stored array.
} else {
    answerArray = JSON.parse(localStorage['answerArray']);
}
//loads the question into the question div, depending on what is the current question.
$(document).ready(function () {
    getQuestions();

    if (currentQ == 29) {
        hideAll();
    }
    else if (currentQ > 11) {
        question12Reached();
    } else {
        $("#question").fadeIn("500");
        $("#buttons").fadeIn("500");
        $("#divAgree").fadeIn("500");
        $("#divDisagree").fadeIn("500");
        $("#top").fadeIn("500");
    }
    
});


//keeps track of what question that should be seen and puts answer in the array.
function nextQuestion() {

    if (currentQ == 11) {
            question12Reached();
        }
    
     if (currentQ < 28) {
         
            $("#questionP").fadeOut("500");
            setTimeout(function() {
                document.getElementById("questionP").innerHTML = question[currentQ];
                $("#questionP").fadeIn("500");
            }, 400);                         
        }
    
        hideNext();
        $('.black').removeClass('black').addClass('orange');
        answerArray[currentQ] = answer;
        localStorage['answerArray'] = JSON.stringify(answerArray);
        currentQ++;
        localStorage.setItem('currentQuestion', currentQ);

        
    //when the last question has been shown, it calls the hideAll() method to show the last screen.
        if (currentQ == 29) {
            hideAll();
        }
}
// Function for changing the selected buttons color.
function change_select(objs) {
    
    $('.black').removeClass('black').addClass('orange');
        objs.className = "button black";
        showNext();
        answer = objs.value.toString();
}
//Shows the next-button
function showNext() {
    document.getElementById("divNext").style.display = "block";
   
}
//Hides the next-button
function hideNext() {
    document.getElementById("divNext").style.display = "none";
}

//calls the SaveResult from codeBehind.
function SaveResultQor() {
   
        localStorage.clear();
        PageMethods.SaveResult(answerArray);
    setTimeout(function() {
        window.location = "main.aspx";
    },500);

}
    
    

//changes the layout for the document after question 12.
function question12Reached() {
    
        $("#buttons").fadeOut("500");
        $("#top").fadeOut("500");
        $("#divDisagree").fadeOut("500");
        $("#divAgree").fadeOut("500");
        $("#question").fadeOut("500");
        setTimeout(function () {
            document.getElementById("top").innerHTML = "Har du upplevt något av följande under de senaste 24 timmarna?";
            document.getElementById("divDisagree").innerHTML = "Inte alls";
            document.getElementById("divAgree").innerHTML = "Hela tiden";
            document.getElementById("btn1").value = "5";
            document.getElementById("btn2").value = "4";
            document.getElementById("btn4").value = "2";
            document.getElementById("btn5").value = "1";
            document.getElementById("questionP").innerHTML = question[currentQ];
            $("#question").fadeIn("500");
            $("#buttons").fadeIn("500");
            $("#divAgree").fadeIn("500");
            $("#divDisagree").fadeIn("500");
            $("#top").fadeIn("500");
        }, 500);
    }
 
//hides all buttons and stuff when the form is complete. And shows the "submit" button.
function hideAll() {
    $("#buttons").fadeOut("500");
    $("#top").fadeOut("500");
    $("#divDisagree").fadeOut("500");
    $("#divAgree").fadeOut("500");
    $("#question").fadeOut("500");
    hideNext();
    setTimeout(function () {
        document.getElementById("top").innerHTML = 'Tack för din medverkan!<br><br> Nu är det färdigt, tryck på knappen "slutför" för att skicka resultatet av formuläret.';

        $("#top").fadeIn("500");
        $("#divSend").fadeIn("500");
        
    }, 500);
}


      


